import Vue from 'vue'
import Vuex from 'vuex'
import VueRouter from 'vue-router'

import "./public-path";

import App from './App.vue'
import routes from "./router"

import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';

import '@/styles/flex.css'
import '@/styles/comman.scss'

import store from './store'

import { util } from '@/utils/common.js'

const packageName = require('../package.json').name;

// import requestMethods from "@/utils/request"

Vue.config.productionTip = false
Vue.use(VueRouter)
Vue.use(Vuex)
Vue.use(ElementUI, {
  size: 'medium', // set element-ui default size
}) 

let instance = null;
let router = null;

// const router = new VueRouter({
//   mode:"history",
//   routes
// })

/**
 * 渲染函数
 * 两种情况：主应用生命周期钩子中运行 / 微应用单独启动时运行
 */
function render(props) {
  let i18n 
  if (props) {
    for(let plugin in props.plugin){
      //注册插件
      Vue.use(props.plugin[plugin]);
    }
    //注册全局组件
    for(let component in props.components){
      Vue.component(component, props.utils.contentExtend(props.components[component]))
    }
    for(let component in window.publicComponents){
      Vue.component(component, props.utils.contentExtend(window.publicComponents[component]))
    }
    //所有公共方法都被添加到了common.js的util中
    for(let fuc in props.utils){
      util[fuc] = props.utils[fuc]
    }
    //封装的axios方法也拿过来了
    for(let key in props.requestMethods){
      Vue.prototype[key] = props.requestMethods[key]
    }
    Vue.prototype.$Bus = props.Bus;
    Vue.prototype.$ThemeInfo = props.ThemeInfo;

    i18n = props.i18n;
    Vue.prototype.$t = (key, value) => i18n.t(key, value)
    
  }
  // 在 render 中创建 VueRouter，可以保证在卸载微应用时，移除 location 事件监听，防止事件污染
  router = new VueRouter({
    // 运行在主应用中时，添加路由命名空间 /vue
    //base: window.__POWERED_BY_QIANKUN__ ? `/${packageName}` : "/",
    //mode: "history",
    //base: process.env.BASE_URL,
    routes,
  });

  // 判断 qiankun 环境则进行路由拦截，判断跳转路由是否有 /micro 开头前缀，没有则加上
  if(window.__POWERED_BY_QIANKUN__){
    router.beforeEach((to, from, next) => {
      if(!to.path.includes('/'+packageName)){
        next({
          path: '/' + packageName + to.path
        })
      }else{
        next()
      }
    })
  }

  
// Vue.prototype.$httpProj = packAxios('IOT-BRIDGE-PROJ')

  // 挂载应用
  instance = new Vue({
    router,
    store,
    render: (h) => h(App),
  }).$mount("#app");
}

// 独立运行时，直接挂载应用
if (!window.__POWERED_BY_QIANKUN__) {
  render();
}

/**
 * bootstrap 只会在微应用初始化的时候调用一次，下次微应用重新进入时会直接调用 mount 钩子，不会再重复触发 bootstrap。
 * 通常我们可以在这里做一些全局变量的初始化，比如不会在 unmount 阶段被销毁的应用级别的缓存等。
 */
export async function bootstrap() {
  console.log("customized bootstraped");
}

/**
 * 应用每次进入都会调用 mount 方法，通常我们在这里触发应用的渲染方法
 */
export async function mount(props) {
  console.log("customized mount", props);
  render(props);
}

/**
 * 应用每次 切出/卸载 会调用的方法，通常在这里我们会卸载微应用的应用实例
 */
export async function unmount() {
  console.log("customized unmount");
  instance.$destroy();
  instance = null;
  router = null;
}